<template >
  <van-row >
    <van-row>
      <van-col span="24" style="height: 46px;">
        <van-nav-bar fixed >
          <van-icon name="arrow-left" slot="left" size="34px" color="#101010" @click="onClickLeft"></van-icon>
          <span slot="title" style="font-size: 18px">自定义训练</span>
        </van-nav-bar>
      </van-col>
    </van-row>
    <div>
      <van-button type="default" size="large" icon="plus" @click="add">创建我的训练</van-button>
    </div>
    <div class="mytra-box">
      <div class="mytra" @click="goitem()">
        <div>
          <h2>我的训练</h2>
        </div>
        <div class="tar-item">
          <div class="left-item">
            <p>一个动作</p>
            <p>不循环</p>
          </div>
          <div class="right-item">
            <p>小于一分钟</p>
          </div>
        </div>
      </div>
    </div>
  </van-row>
</template>
<script>
export default {
  name:'customtraining',
  methods:{
    onClickLeft(){
      this.$router.go(-1)
    },
    add(){

    },
    goitem(){
      this.$router.push('/traItem')
    }
  },
  mounted() {
    document.querySelector('body').setAttribute('style', 'background-color:#f5f5f5')
  },
  beforeDestroy() {
    document.querySelector('body').removeAttribute('style')
  }

  }
</script>


<style scoped>
  .mytra-box{
   margin-top: 10px;
  }
  .mytra{
  background: white;padding:0 10px;
  }
  .mytra h2{
    line-height: 40px;font-size: 14px;font-weight: normal;
  }
  .tar-item{
    width: 100%;border-top: 1px solid #eeeeee;padding: 9px 0;
  }
  .left-item{
    float: left;font-size: 14px;line-height: 20px;
  }
  .right-item{
    float: right;
  }
  .right-item p{
    margin-top: 10px;
  }
  .tar-item:before,.tar-item:after{content:" ";display:table}
  .tar-item:after{clear:both}

</style>
